<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>联考报名</title>
  <meta itemprop="name" content="这场被誉为“小高考”的联考，为啥吸引上百万考生？" />
  <meta itemprop="image" content="/img/share-icon.jpg" />
  <meta name="format-detection" content="telephone=no">
  <meta name="description" itemprop="description" content="一百万高考生报名参加这场“小高考”超级全能生联考被刷屏炒火了！" />
  <link rel="stylesheet" href="/css/reset.css">
  <link rel="stylesheet" href="/css/normalize.css">
  <link rel="stylesheet" href="/css/pages/lk-signup.css">
  <% include ../component/_common_tongji.html %>  
  <script>!function (e) { function t(a) { if (i[a]) return i[a].exports; var n = i[a] = { exports: {}, id: a, loaded: !1 }; return e[a].call(n.exports, n, n.exports, t), n.loaded = !0, n.exports } var i = {}; return t.m = e, t.c = i, t.p = "", t(0) }([function (e, t) { "use strict"; Object.defineProperty(t, "__esModule", { value: !0 }); var i = window; t["default"] = i.flex = function (normal, e, t) { var a = e || 100, n = t || 1, r = i.document, o = navigator.userAgent, d = o.match(/Android[\S\s]+AppleWebkit\/(\d{3})/i), l = o.match(/U3\/((\d+|\.){5,})/i), c = l && parseInt(l[1].split(".").join(""), 10) >= 80, p = navigator.appVersion.match(/(iphone|ipad|ipod)/gi), s = i.devicePixelRatio || 1; p || d && d[1] > 534 || c || (s = 1); var u = normal ? 1 : 1 / s, m = r.querySelector('meta[name="viewport"]'); m || (m = r.createElement("meta"), m.setAttribute("name", "viewport"), r.head.appendChild(m)), m.setAttribute("content", "width=device-width,user-scalable=no,initial-scale=" + u + ",maximum-scale=" + u + ",minimum-scale=" + u), r.documentElement.style.fontSize = normal ? "50px" : a / 2 * s * n + "px" }, e.exports = t["default"] }]); flex(false, 100, 1);</script>
  <style>
    [v-cloak] {
      display: none;
    }
    #showCompatible{
      display: none;
    }
  </style>
  <script>
    var imgs = ['/img/1_03.jpg', '/img/6_01.jpg', '/img/6_02.png', '/img/6_03.png', '/img/6_04.png']
    var len = imgs.length;
    while(len--){
      var image = new Image();
      image.onload = function(){
        image.src = imgs[len];
      }
    }
    window.onload = function(){
      var compa = document.getElementById('#showCompatible');
      if(compa){
        compa.style.display = 'block';
      }
    }
  </script>
</head>
<body>
  <div id="lkSignUp" class="content">
    <div v-if="false" id="showCompatible" style="font-size:0.33rem;">请更换chrome浏览器或在微信、QQ中打开该链接</div>
    <div v-cloak>
      <div class="query" v-if="!loginInfo.token">
        <nav>
          <img src="/img/1_03.jpg" alt="联考报名">
        </nav>
        <div class="phone">
          <input type="tel" name="phone" placeholder="请输入手机号" v-model="loginInfo.phone" style="-webkit-appearance: none;">
          <div class="tel">
            <input type="tel" placeholder="请输入六位验证码" name="sms_code" class="smsCode" v-model="loginInfo.sms" style="-webkit-appearance: none;">
            <span class="send" @click="handleSend">{{smsText}}</span>
          </div>
          <button @click="handleEnter">报名</button>
        </div>
      </div>

      <div class="sign" v-if="loginInfo.token && loginInfo.token !=''">
        <div class="signTop">
          <img src="/img/6_01.jpg" alt="超级全能生">
          <div class="right">
            <h2>超级全能生全国3月线上联考</h2>
            <span>报名费：</span>
            <strong>￥{{money}}</strong>
          </div>
        </div>
        <div class="perfect">完善报名信息</div>
        <form class="form">
          <div>
            <label for="name">姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名：</label>
            <input type="text" v-model="signUpInfo.realname" name="realname" placeholder="请输入姓名">
          </div>
          <!-- <br> -->
          <div>
            <label for="school">学&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;校：</label>
            <input type="text" v-model="signUpInfo.school" name="school" placeholder="请输入学校">
          </div>
          <!-- <br> -->
          <div>
          <label for="email">邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱：</label>
          <input type="email" v-model="signUpInfo.email" name="email" placeholder="请输入邮箱">
        </div>
          <div class="region">
            所在地区：
            <select name="city_id" v-model="signUpInfo.city_id" @change="cityChange" style="-webkit-appearance: none;">
              <option value="1">北京</option>
              <option v-for="item in cityList" :value="item.city_id">{{item.name}}</option>
            </select>
          </div>
          <div class="subject">
            学科试卷：
            <select class="paper" v-model="signUpInfo.exam_type" @click="signUpInfo.city_id == 95 ? showSubjectSelect = true:showSubjectSelect=false"
              name="exam_type" style="-webkit-appearance: none;">
              <option value="1" v-if="signUpInfo.city_id == 95">{{subjectsStr}}</option>
              <option value="2" v-if="signUpInfo.city_id != 95">文科（语文、数学、外语、文综）</option>
              <option value="3" v-if="signUpInfo.city_id != 95">理科（语文、数学、外语、理综）</option>
            </select>
            <div class="occlusion" v-if="showSubjectSelect">
              <div class="drop">
                <div class="drop_left">
                  <p>必选科目</p>
                  <ul>
                    <li>
                      <span>
                        <i></i>
                      </span>语文</li>
                    <li>
                      <span>
                        <i></i>
                      </span>数学</li>
                    <li>
                      <span>
                        <i></i>
                      </span>外语</li>
                  </ul>
                </div>
                <div class="drop_right">
                  <p>7选3</p>
                  <input type="checkbox" id="biology" name="subjects" value="生物">
                  <label for="biology">生物</label>

                  <input type="checkbox" id="physics" name="subjects" value="物理">
                  <label for="physics">物理</label>

                  <input type="checkbox" id="geography" name="subjects" value="地理">
                  <label for="geography">地理</label>

                  <input type="checkbox" id="chemistry" name="subjects" value="化学">
                  <label for="chemistry">化学</label>
                  <input type="checkbox" id="politics" name="subjects" value="政治">
                  <label for="politics">政治</label>

                  <input type="checkbox" id="history" name="subjects" value="历史">
                  <label for="history">历史</label>

                  <input type="checkbox" id="thought" name="subjects" value="技术">
                  <label for="thought">技术</label>
                  <input type="checkbox" id="thought" name="subjects" style="opacity:0">
                  <label for="thought" style="opacity:0">政治</label>
                  <button class="determine" @click.prevent="handleDetermine">确定</button>
                </div>
              </div>
            </div>
          </div>
        </form>
        <div class="payment" v-if="!showSubjectSelect">
          <div class="pay">
            <p>选择支付方式</p>
            <% if(pt == 'wechat'){%>
              <div class="wx">
                <img src="/img/6_02.png" alt="微信支付">
                <input type="radio" id="wx" v-model="signUpInfo.pay_type" value="1">
                <label for="wx">微信</label>
              </div>
            <%}%>
            <% if(pt == 'wap'){%>
              <div class="zhi">
                <img src="/img/6_03.png">
                <input type="radio" id="zhi" v-model="signUpInfo.pay_type" value="2">
                <label for="zhi">支付宝</label>
              </div>
            <%}%>
            <% if(pt == 'qq'){%>
              <div class="qq">
                <img src="/img/6_04.png">
                <input type="radio" id="qq" v-model="signUpInfo.pay_type" value="3">
                <label for="qq">qq钱包</label>
              </div>
            <%}%>
            <button class="payEnter" :class="{paying:submiting}" :disabled="submiting" @click="handleSubmit">{{submiting?"支付中...":"支付报名"}}</button>
            <a href="javascript:;" class="toggle" @click='handleToggle'>切换账号</a>
          </div>
        </div>
      </div>

    </div>
  </div>
  <script src="https://sfile.tl100.com/js/libs/vue.min.js"></script>
  <script src="https://sfile.tl100.com/js/libs/axios.min.js"></script>
  <% if(pt == 'qq'){%>
    <script src="https://sfile.tl100.com/js/libs/qqapi.js"></script>
  <%}%>
      <script>
        var api = axios.create({
          baseURL: 'https://api.tl100.com/exam_signup',
          withCredentials: true,
          timeout: 5000,
          headers: { 'Content-Type': 'application/json;charset=UTF-8' }
        });
        function setLog(api, error) {
          var mydate = new Date();
          mydate.setHours(mydate.getHours()+8)
          axios.post('https://m.tl100.com/sce', {
            date: mydate,
            api: api,
            info: error
          });
        }
        var app = new Vue({
          el: '#lkSignUp',
          data: {
            money: '9.9',
            cityList: [],
            loginInfo: {
              phone: "",
              sms: "",
              token: ""
            },
            smsSending: false,
            smsText: '发送',
            signUpInfo: {
              sign_up_id: -1,
              state: 0,
              from: "wap",
              realname: "",
              school: "",
              email: "",
              city_id: 1,
              exam_id: 1,
              exam_type: 2,
              subjects: "",
              origin: "",
              from_invitation_code: "",
              code: "",
              pay_type: 1,
              return_url: ""
            },
            subjectsStr: "语文、数学、外语、（7选3）",
            showSubjectSelect: false,
            submiting: false,
            enter: false
          },
          mounted: function () {
            this.loginInfo.token = localStorage.getItem("token");
            if (this.loginInfo.token && this.loginInfo.token != '') {
              this.getUserInfo();
            }
            var _this = this;
            api.post('api/base_info/getCityList').then(function (res) {
              _this.cityList = res.data.msg;
            });
            <% if (code) {%>
              this.signUpInfo.code = "<%= code %>";
            <%}%>
            <% if (pt) {%>
              this.signUpInfo.from = "<%= pt %>";
            <%}%>       
            <% if (invitation_code) {%>
              this.signUpInfo.from_invitation_code = "<%= invitation_code %>";
            <%}%> 
            <% if (origin) {%>
              this.signUpInfo.origin = "<%= origin %>";
            <%}%>     
            if (this.signUpInfo.origin == 'lxf' || this.signUpInfo.origin == 'gx' || this.signUpInfo.origin == 'wy') {
              this.money = '6.9';
            }
            if (this.signUpInfo.from == 'wechat') {
              this.signUpInfo.pay_type = 1;
            }
            if (this.signUpInfo.from == 'wap') {
              this.signUpInfo.pay_type = 2;
            }
            if (this.signUpInfo.from == 'qq') {
              this.signUpInfo.pay_type = 3;
            }
            this.signUpInfo.return_url = "https://m.tl100.com/lk/signup";
          },
          methods: {
            getUserInfo: function () {
              var vm = this;
              api.post('api/sign_up/getUserSignUp', {
                token: this.loginInfo.token
              }).then(function (res) {
                if (res.data.res_code == 1) {
                  if (res.data.msg.state && res.data.msg.state > 0) {
                   location.replace("/lk/success?invitation_code="+res.data.msg.invitation_code);
                  }
                }
                if (res.data.res_code < 0) {
                  localStorage.removeItem("token");
                  vm.loginInfo.token = "";
                  setLog('api/sign_up/getUserSignUp:fail', JSON.stringify(res.data));
                }
              }).catch(function (error) {
                setLog('api/sign_up/getUserSignUp:catch', JSON.stringify(error));
              });
            },
            payAli: function (rs_data) {
              location.href = "https://openapi.alipay.com/gateway.do?" + rs_data;
            },
            payQQ: function (rs_data, order_id, sign_up_id, token) {
              var vm = this;
              mqq.tenpay.pay({
                tokenId: rs_data.tokenId,
              }, function (result, resultCode) {
                var params = {};
                params.order_id = order_id;
                params.sign_up_id = sign_up_id;
                params.token = token;
                api.post('/api/sign_up/getQQOrder', params)
                  .then(function (response) {
                    var rs_data = response.data.msg;
                    if (rs_data.state > 0) {
                      vm.getUserInfo();
                    } else {
                      alert('支付失败,请刷新页面重试！');
                      setLog('/api/sign_up/getQQOrder:fail', JSON.stringify(rs_data));
                    }
                    vm.submiting = false;
                  })
                  .catch(function (error) {
                    alert('支付超时,请刷新页面重试！');
                    setLog('/api/sign_up/getQQOrder:catch', JSON.stringify(error));
                    vm.submiting = false;
                  });
              });
            },
            payWX: function (rs_data, order_id, sign_up_id, token) {
              var appId = "";
              var timeStamp = "";
              var nonceStr = "";
              var package = "";
              var signType = "";
              var paySign = "";
              var vm = this;
              function onBridgeReady() {
                WeixinJSBridge.invoke(
                  'getBrandWCPayRequest', {
                    "appId": appId,     //公众号名称，由商户传入     
                    "timeStamp": timeStamp,         //时间戳，自1970年以来的秒数     
                    "nonceStr": nonceStr, //随机串     
                    "package": package,
                    "signType": signType,         //微信签名方式：     
                    "paySign": paySign //微信签名 
                  },
                  function (res) {
                    var params = {};
                    params.order_id = order_id;
                    params.sign_up_id = sign_up_id;
                    params.token = token;
                    api.post('/api/sign_up/getWxOrder', params).then(function (response) {
                      var rs_data = response.data.msg;
                      if (rs_data.state > 0) {
                        vm.getUserInfo();
                      } else {
                        alert('支付失败,请刷新页面重试！');
                        setLog('/api/sign_up/getWxOrder:fail', JSON.stringify(rs_data));
                      }
                      vm.submiting = false;
                    }).catch(function (error) {
                      alert('支付超时,请刷新页面重试！');
                      setLog('/api/sign_up/getWxOrder:catch', JSON.stringify(error));
                      vm.submiting = false;
                    });
                  }
                );
              }
              appId = rs_data.appId;
              timeStamp = rs_data.timeStamp;
              nonceStr = rs_data.nonceStr;
              package = rs_data.package;
              signType = rs_data.signType;
              paySign = rs_data.paySign;

              if (typeof WeixinJSBridge == "undefined") {
                if (document.addEventListener) {
                  document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
                } else if (document.attachEvent) {
                  document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
                  document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
                }
              } else {
                onBridgeReady();
              }
            },
            handleSend: function () {
              if (!(/^[1][3,4,5,7,8][0-9]{9}$/.test(this.loginInfo.phone))) {
                alert("请输入正确的手机号码！");
                return false;
              }
              if (this.smsSending) {
                return;
              }
              var i = 60;
              this.smsSending = true;
              this.smsText = '60s';
              var timeId = setInterval(() => {
                i--;
                this.smsText = (i + 's');
                if (i == 0) {
                  clearInterval(timeId);
                  this.smsText = '发送';
                  this.smsSending = false;
                }
              }, 1000);
              var vm = this;
              api.post('/api/user/sendSmsCode', {
                phone: this.loginInfo.phone,
              }).then(function (res) {
                if (res.data.res_code != 1) {
                  alert('发送失败，请稍后重试！');
                  setLog('/api/user/sendSmsCode:fail', JSON.stringify(res.data));
                  clearInterval(timeId);
                  vm.smsText = '发送';
                  vm.smsSending = false;
                }
              }).catch(function (error) {
                setLog('/api/user/sendSmsCode:catch', JSON.stringify(error));
              })
            },
            cityChange: function (ele) {
              if (this.signUpInfo.city_id == 95) {
                this.showSubjectSelect = true;
              }
            },
            handleSubmit: function () {
              if (this.submiting) {
                return;
              }
              if (this.signUpInfo.realname == "") {
                alert('姓名不能为空');
                return;
              }
              if (this.signUpInfo.realname.length > 6) {
                alert('最多输入6个汉字或英文字母！');
                return;
              }
              if (this.signUpInfo.school == "") {
                alert('学校不能为空');
                return;
              }
              var arr = ["语文", "数学", "外语", "历史", "地理", "政治"];
              if (this.signUpInfo.exam_type == 2) {
                this.signUpInfo.subjects = JSON.stringify(arr);
              } else if (this.signUpInfo.exam_type == 3) {
                arr = ["语文", "数学", "外语", "物理", "化学", "生物"];
                this.signUpInfo.subjects = JSON.stringify(arr);
              } else if (this.signUpInfo.subjects == "") {
                alert('科目不能为空');
                return;
              }
              // if (this.signUpInfo.email == "") {
              //   alert('邮箱不能为空');
              //   return;
              // } else if (!(/^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/.test(this.signUpInfo.email))) {
              //   alert('请输入正确的邮箱');
              //   return;
              // }
              var that = this;
              this.submiting = true;
              this.signUpInfo.token = this.loginInfo.token;
              api.post('/api/sign_up/signUp', this.signUpInfo)
                .then(function (res) {
                  if (res.data.res_code == 1) {
                    var rs_data = res.data.msg;
                    var token = that.loginInfo.token
                    if(rs_data.invitation_code && rs_data.invitation_code != ""){
                      location.replace("/lk/success?invitation_code="+rs_data.invitation_code);                      
                      return;
                    }
                    switch (that.signUpInfo.pay_type) {
                      case 1:
                        that.payWX(rs_data.pay_params, rs_data.order_id, rs_data.sign_up_id, token);
                        break;
                      case 2:
                        that.payAli(rs_data.pay_params, rs_data.order_id, rs_data.sign_up_id, token);
                        break;
                      case 3:
                        that.payQQ(rs_data.pay_params, rs_data.order_id, rs_data.sign_up_id, token);
                        break;
                    }
                  } else {
                    that.submiting = false;
                    alert('支付失败，请关闭网页后重新尝试！');
                    setLog('/api/sign_up/signUp:fail', JSON.stringify(res.data));
                  }
                }).catch(function (error) {
                  alert('支付超时，请刷新页面重试！');
                  setLog('/api/sign_up/signUp:catch', JSON.stringify(error));
                  that.submiting = false;
                });
            },
            handleDetermine: function () {
              var artNum = document.getElementsByName('subjects');
              var arr = [];
              var subjects = ["语文", "数学", "外语"];
              for (var i = 0; i < artNum.length; i++) {
                if (artNum[i].checked) {
                  arr.push(artNum[i].value);
                }
              }
              if (arr.length > 3) {
                alert('不能大于3科哦！');
                return;
              }
              if (arr.length < 3) {
                alert('不能小于3科哦！');
                return;
              }
              subjects = subjects.concat(arr)
              subjects.forEach(function (e, i) {
                if (i == 0) {
                  this.subjectsStr = e;
                } else {
                  this.subjectsStr += "、" + e;
                }
              }, this);
              this.showSubjectSelect = false;
              this.signUpInfo.exam_type = 1;
              this.signUpInfo.subjects = JSON.stringify(subjects);
            },
            handleEnter: function () {
              if (this.enter) {
                return;
              }
              if (this.loginInfo.phone == "") {
                alert('请填写手机号！');
                return;
              }
              if (this.loginInfo.sms == "") {
                alert('请填写验证码！');
                return;
              }
              var vm = this;
              this.enter = true;
              api.post('/api/user/login', {
                phone: this.loginInfo.phone,
                sms_code: this.loginInfo.sms,
                code:this.signUpInfo.code
              }).then(function (res) {
                if (res.data.res_code == 1) {
                  localStorage.setItem('token', res.data.msg.token);
                  if (res.data.msg.sign_up_info.state && res.data.msg.sign_up_info.state > 0) {
                    location.replace("/lk/success?invitation_code="+res.data.msg.sign_up_info.invitation_code);
                  } else {
                    vm.loginInfo.token = res.data.msg.token;  
                  } 
                } else {
                  alert(res.data.msg);
                  vm.enter = false;
                  setLog('/api/user/login:fail', JSON.stringify(res.data));
                }
              })
                .catch(function (error) {
                  alert('登录超时，请刷新页面重试！');
                  setLog('/api/user/login:catch', JSON.stringify(error));
                  vm.enter = false;
                });
            },
            handleToggle: function () {
              localStorage.removeItem('token');
              location.replace('/lk/signup');
            }
          }
        })
      </script>
</body>

</html>